<%@ page language="java" pageEncoding="UTF-8"%>
<%@include file="../../common/import.jsp"%>
<html>
<head>
<title></title>
   <style type="text/css">
      th{
			border: 0px solid #e6e7e9;
			width:150px;
			border-width: 0px;
			text-align: right;
			vertical-align: middle;
	   }
	   td{
	      border: 0px solid #e6e7e9;
	      border-width: 0px;
	   }
	   
   </style>
   <script src="${ctx}/resources/js/jquery.validate.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
       $(function(){
	      $("#formTable").validate({
			   onsubmit: true, // 是否在提交时验证 
			   //onfocusout: true, // 是否在获取焦点时验证 
			   onkeyup: false,
			   validClass: 'checked',
			   rules: {
				   roleName: {
						required: true,
						maxlength: 15,
						remote:{
							 type: "POST",
							 url: "${ctx}/sys/role/validateRoleName.do",
							 dataType: "json", 
							 data: {
								 id: '${role.id}',
								 name: function() {
									   return $("#roleName").val();
								   }
							 }
						}
					},
					remark: {
						maxlength: 250
					}
				},
				messages: {
					roleName: {
						required: "请输入角色名称且长度不大于15",
						maxlength: "角色名称长度不能大于{0}",
						remote: jQuery.format("角色名称已经被使用")
					},
					remark: {
						maxlength: "长度不能大于{0}"
					}
				},
				success: function(label){
					label.addClass("checked").html("&nbsp;");
				},
				submitHandler: function(form) {
					$.blockUI();
					$.ajax({
		    			  url: "${ctx}/sys/role/save.do",   // 提交的页面
		    		      data: $('#formTable').serialize(), // 从表单中获取数据
		    		      type: "POST",
		    		      success: function(data) {
		    		    	  $.unblockUI();
		    		        	if(data.success==true){
		    		        		reloadData();
		    		        		showSuccessMsg();
		    		        		parent.closeWindow();
		    		        	}else{
		    		        		showFailAlert(data.msg)
		    		        	}
		    		      },
		    		      error: function(xhr) {
		    		    	  $.unblockUI();
		    		    	  showFailAlert2(xhr);
		    		      }
		    		  })
				}
			});
	   });
       function reloadData(){
    	   var tab = parent.$('#tabs').tabs('getSelected');
   		   var ifram = tab.find('iframe')[0];
   		   ifram.contentWindow.reloadGrid();
       }
	   function onSubmit(){
		   $("#formTable").submit();
	   }
   </script>
	<div class="easyui-layout" region="center" style="text-align: left;" fit="true">
		<div region="center" border="false" style="padding-top: 10px; text-align: left; background: #fff; border: 1px solid #ccc;">
			<form id="formTable" method="post" >
			    <input type="hidden" name="id" value="${role.id}"/>
				<table width="100%">
					<tr>
						<th><span style="color: red;">*</span>角色名称：</th>
						<td>
						<input name="roleName" type="text" style="width: 150px;" id="roleName" value="${role.roleName}"/>
						</td>
					</tr>
					<tr>
						<th>备注：</th>
						<td><textarea id="remark" name="remark" rows="6" cols="40" >${role.remark}</textarea>
						</td>
					</tr>
				</table>
			</form>
		</div>
		<div region="south" border="false" style="text-align: right; padding: 5px 5px 5px 0;">
			<a class="easyui-linkbutton" iconcls="icon-ok" href="javascript:void(0)" onclick="onSubmit();">提交</a>
			<a class="easyui-linkbutton" iconcls="icon-cancel" href="javascript:void(0)" onclick="parent.closeWindow();">取消</a>
		</div>
	</div>
</body>
</html>
